<template>
    <div>
        <el-button size="mini" type="danger" @click="string">字符串</el-button>
        <el-button size="mini" type="danger" @click="object">对象</el-button>
        <el-button size="mini" type="danger" @click="routerName">命名的路由</el-button>
        <el-button size="mini" type="success" @click="query">携带参数的例子</el-button>
        <el-button size="mini" type="success" @click="replace">清除历史记录的路由跳转</el-button>
        <el-button size="mini" type="success" @click="go">路由栈的操作</el-button>
    </div>
</template>
<script>
export default {
    methods:{
        // 字符串跳转
        string(){
            this.$router.push('/child1')
        },
        // 对象跳转
        object(){
            this.$router.push({
                path:'/child1'
            })
        },
        // 路由名字跳转
        routerName(){
            this.$router.push({
                name:'child1',
                params:{id:'123'}
            })
        },
        // 带请求参数跳转
        query(){
            this.$router.push({
                name:'child1',
                query:{sex:'女'}
            })
        },
        // 清除历史记录
        replace(){
            this.$router.replace({
                name:'child1',
                query:{sex:'女'}
            })
        },
        // 前进后退
        go(){
           this.$router.go(1) 
        }
    }
}
</script>
